<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>ckplayer</title>
		<script type="text/javascript" src="ckplayer/ckplayer.js" charset="UTF-8"></script>
		<style type="text/css">
			body {
				margin: 0;
				padding: 0px;
				font-family: "Microsoft YaHei", YaHei, "微软雅黑", SimHei, "黑体";
				font-size: 14px
			}
		</style>

	</head>

	<body>
		<div id="video" style="width: 600px;height: 400px;"></div>
		<script type="text/javascript">
			//初始化视频实例
			//http://www.ckplayer.com
			//http://www.ckplayer.com/manualX/23.html
			var videoObject = {
				container: '#video',//“#”代表容器的ID，“.”或“”代表容器的class
				variable: 'player',//该属性必需设置，值等于下面的new chplayer()的对象
				loop: true, //播放结束是否循环播放
				//autoplay: true, //是否自动播放
				volume: 0.5,
				video:'http://img.ksbbs.com/asset/Mon_1703/05cacb4e02f9d9e.mp4'//视频地址
			};
			var player=new ckplayer(videoObject);
			//视频切换
			function changeVideo(videoUrl) {
				if(player == null) {
					return;
				}

				var newVideoObject = {
					container: '#video',//“#”代表容器的ID，“.”或“”代表容器的class
					variable: 'player',//该属性必需设置，值等于下面的new chplayer()的对象
					loop: true, //播放结束是否循环播放
					//autoplay: true, //是否自动播放
					volume: 0.5,
					video: videoUrl
				}
				//判断是需要重新加载播放器还是直接换新地址

				if(player.playerType == 'html5video') {
					if(player.getFileExt(videoUrl) == '.flv' || player.getFileExt(videoUrl) == '.m3u8' || player.getFileExt(videoUrl) == '.f4v' || videoUrl.substr(0, 4) == 'rtmp') {
						player.removeChild();

						player = null;
						player = new ckplayer();
						player.embed(newVideoObject);
					} else {
						player.newVideo(newVideoObject);
					}
				} else {
					if(player.getFileExt(videoUrl) == '.mp4' || player.getFileExt(videoUrl) == '.webm' || player.getFileExt(videoUrl) == '.ogg') {
						player = null;
						player = new ckplayer();
						player.embed(newVideoObject);
					} else {
						player.newVideo(newVideoObject);
					}
				}
			}
			//视频切换调用
			function tabVideo(videoUrl) {
				alert(videoUrl)
				changeVideo(videoUrl);
			}
		</script>
		<button onclick="tabVideo('http://img.ksbbs.com/asset/Mon_1703/05cacb4e02f9d9e.mp4')">视频1</button>
		<button onclick="tabVideo('http://localhost:8080/waibao/xinxuewen/videodemo/mp4/movie.mp4')">视频2</button>
	</body>

</html>